﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>homePage</title>

    <!-- WinJS references -->
    <link href="//Microsoft.WinJS.1.0/css/ui-light.css" rel="stylesheet" />
    <script src="//Microsoft.WinJS.1.0/js/base.js"></script>
    <script src="//Microsoft.WinJS.1.0/js/ui.js"></script>

    <link href="/css/default.css" rel="stylesheet" />
    <link href="/pages/home/home.css" rel="stylesheet" />
    <script src="homecodebehind.js"></script>
    <script src="/pages/home/home.js"></script>
    <script src="../searchresults/searchresultscodebehind.js"></script>
</head>
<body>
    <!-- The content that will be loaded and displayed. -->
    <div class="fragment homepage">
        <div id="citiesTemplate" data-win-control="WinJS.Binding.Template">
            <div class="item-wrapper-cities">
                <p data-win-bind="innerText: name"></p>
            </div>
        </div>
        <div id="sectorsTemplates" data-win-control="WinJS.Binding.Template" data-id="" data-win-bind="data-id: id">
            <div class="item-wrapper-sectors">
                <p data-win-bind="innerText: name"></p>
            </div>
        </div>
        <div id="employmentTemplate" data-win-control="WinJS.Binding.Template" data-id="" data-win-bind="data-id: id">
            <div class="item-wrapper-employmentOptions">
                <p data-win-bind="innerText: name"></p>
            </div>
        </div>
        <div id="savedFavouritesTemplate" data-win-control="WinJS.Binding.Template" class="sections">
            <p>Name: <span data-win-bind="innerText: name"></span></p>
        </div>
        <header aria-label="Header content" role="banner">
            <button class="win-backbutton" aria-label="Back" disabled type="button"></button>
            <h1 class="titlearea win-type-ellipsis">
                <span class="pagetitle">Безработен.Съм</span>
                <span style="font-size: 13pt; font-weight: bold;" id="townInstructions">1. Избери си град &raquo;</span>
                <span style="font-size: 13pt; font-weight: bold;" id="sectorInstructions">2. Избери си сектор &raquo;</span>
                <span style="font-size: 13pt; font-weight: bold;" id="optionsInstructions">3. Избери си работно време &raquo;</span>
                <span id="faq"><a href="#">FAQ</a></span>
            </h1>
        </header>
        <section aria-label="Main content" role="main">

            <div id="instructions">
            </div>

            <aside id="cities" data-win-control="WinJS.UI.ListView" data-win-options="{
                   itemDataSource: ViewModels.cities.dataSource,
                   itemTemplate: select('#citiesTemplate'),
                   layout: {type: WinJS.UI.ListLayout}
                }">
            </aside>

            <div id="sectors" data-win-control="WinJS.UI.ListView" data-win-options="{
                   itemDataSource: ViewModels.sectors.dataSource,
                   itemTemplate: select('#sectorsTemplates'),
                   layout: {type: WinJS.UI.GridLayout}
                }">
            </div>

            <div id="employmentOptions" data-win-control="WinJS.UI.ListView" data-win-options="{
                   itemDataSource: ViewModels.employmentTypes.dataSource,
                   itemTemplate: select('#employmentTemplate'),
                   layout: {type: WinJS.UI.ListLayout}
                }">
            </div>
        </section>
    </div>

    <div id="scenarioAppBar" data-win-control="WinJS.UI.AppBar">
        <button class="unremoveble" data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdSearch',label:'Търси',icon:'forward',section:'global',extraClass:'singleSelect',tooltip:'Покажи резултати'}"></button>
        <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdSelectAll',label:'Избери всички',icon:'selectall',section:'selection',extraClass:'multiSelect',tooltip:'Избери всички критерии'}"></button>
        <button class="unremoveble" data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdClearAll',label:'Изчисти',icon:'clearselection',section:'selection',extraClass:'multiSelect',tooltip:'Изчисти всички избрани'}"></button>
        <hr data-win-control="WinJS.UI.AppBarCommand" data-win-options="{type:'separator',section:'selection',extraClass:'multiSelect'}" />
        <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdSave',label:'Запази Любими',icon:'save',section:'selection', tooltip:'Запази критериите за търсене в любими'}"></button>
        <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdLoad',label:'Покажи Любими',icon:'paste',section:'selection', tooltip:'Покажи Любими'}"></button>
        <hr data-win-control="WinJS.UI.AppBarCommand" data-win-options="{type:'separator',section:'selection',extraClass:'multiSelect'}" />
        <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdLoadFile',label:'Зареди шаблон',icon:'movetofolder',section:'selection', tooltip:'Зареди оферти от шаблон'}"></button>
    </div>

    <div id="saveFlyout" data-win-control="WinJS.UI.Flyout"
        data-win-options="{anchor: 'cmdSave'}">

        <label for="searchName">Име</label>
        <br />
        <input type="text" id="searchName" />
        <br />
        <label for="searchName">Описание</label>
        <br />
        <textarea id="searchDescription"></textarea>
        <br />
        <button id="saveFavourtesBtn">Запази в любими</button>
    </div>

    <div id="loadFlyout" data-win-control="WinJS.UI.Flyout"
        data-win-options="{anchor: 'cmdSave'}">
        <h3>Любими търсения:</h3>
        <div data-win-control="WinJS.UI.ListView" data-win-options="{
                   itemDataSource: ViewModels.searchList.dataSource,
                   itemTemplate: select('#savedFavouritesTemplate'),
                   layout: {type: WinJS.UI.ListLayout},
                   oniteminvoked: HomeCodeBehind.showListViewInvokedItem
                }">
            >
        </div>
    </div>
</body>
</html>
